<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #infoDiv div{
            border: 1px solid #000;
            background-color: aquamarine;
            height: 20px;
        }
    </style>
    <script src="jquery-3.2.1.min.js"></script>
    <script>
        function addInfo() {
            var info = $("#contentArea").val();
            if(info.length ==0){
                alert('请填写内容');
                return;
            }
            $("#infoDiv").append(`<div>${info}</div>`);
            $("#inputDiv").slideUp("false");
            $("#contentArea").val("");
        }
    </script>
</head>
<body>
    <div style="width: 300px;border:1px solid #000">
        <div>老师说</div>
        <div style="height: 100px">
            <h1>今天考试客户端</h1>
        </div>
        <hr>
        <div id="infoDiv"></div>
        <div style="text-align: right"><a href="javascript:$('#inputDiv').slideDown('fast');">回复</a></div>
        <div id="inputDiv" style="display: none">
            <textarea id="contentArea" style="width: 280px;height: 100px"></textarea>
            <div style="text-align: right">
                <input type="button" value="评论" onclick="addInfo()">
            </div>
        </div>
    </div>
</body>
</html>